﻿<!DOCTYPE html> 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<link href="${root!}/lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
<link href="${root!}/lib/ligerUI/skins/ligerui-icons.css" rel="stylesheet" type="text/css" />
<script src="${root!}/lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="${root!}/lib/ligerUI/js/core/base.js" type="text/javascript"></script>
<script src="${root!}/lib/ligerUI/js/plugins/ligerToolBar.js" type="text/javascript"></script>
<script src="${root!}/lib/ligerUI/js/ligerui.all.js" type="text/javascript"></script>
<script src="${root!}/lib/ligerUI/js/plugins/ligerForm.js"></script>
<script src="${root!}/lib/ligerUI/js/plugins/ligerTip.js" type="text/javascript"></script>
<script src="${root!}/lib/jquery-validation/jquery.validate.min.js"></script>
<script src="${root!}/lib/jquery-validation/jquery.metadata.js" type="text/javascript"></script>
<script src="${root!}/lib/jquery-validation/messages_cn.js" type="text/javascript"></script>
<script src="${root!}/lib/js/orders.js"></script>
<script> 
var groupicon = "${root!}/lib/ligerUI/skins/icons/communication.gif";
var memeber = '${root!}/lib/ligerUI/skins/icons/memeber.gif';
var customers = '${root!}/lib/ligerUI/skins/icons/customers.gif';
var g = null;
var f = null;
var t = null;
var u = null;
var s = null;
var userGrid = null;
var roleGrid = null;
var userListbox = null;
var roleListbox = null;
$(function (){
	/**工具栏*/	
	$("#toptoolbar").ligerToolBar({ items: [
		/* {text: '添加多个用户/角色', click: f_ImportMore, icon:'customers'}, */
		{ text: '添加用户', click: f_AddUser,icon:'memeber'},
		{ line:true },
		{ text: '修改用户', click: f_ModifyUser ,icon:'modify'},
		{ line:true },
		{ text: '移除用户', click: f_DelUser,icon:'role'},
		/* { line:true },
		{ text: '查询', click: f_Search,icon:'search2'} */
		
	]});
	
	$(function (){
		$("#layout1").ligerLayout({ leftWidth: 200});
	});
	
	 //树
	t = $("#tree1").ligerTree({
		isExpand : 2,
		checkbox: false,
		slide: false,
		nodeWidth: 120,
		url:'${root!}/sys/role/getRoleTree',
		ajaxType: 'get', 
		textFieldName : 'text',
		idFieldName : 'id',
		parentIDFieldName : 'parentid',
		onContextmenu:function (node, e)
            { 
                actionNodeID = node.data.text;
                menu.show({ top: e.pageY, left: e.pageX });
                return false;
            },
		onSelect : function(e) {
			if (e.data.id != null) {
				//用户选择ID传给grid
				var x=[];
				x.push({ name: "pid", value: e.data.id });
				g.set('parms', x);			
				g.loadData();
			}
		}
	});
	
	var menu = $.ligerMenu({ top: 100, left: 100, width: 120, items:
	   [{ text: '增加', click: f_New ,icon: 'add' },
	   	{ line: true },
		{ text: '修改', click: f_Modify ,icon:'modify'},
		{ line: true },
		{ text: '删除', click: f_Del ,icon:'delete'},
		{ line: true },
		{ text: '刷新', click: f_Reload ,icon:'refresh'}]
	});
	
	
	/**角色保存*/
	f = $("#RoleForm").ligerForm({
		 inputWidth: 150, labelWidth: 80, space: 50,validate:{},
			 fields: [
			 { name: "ID", type: "hidden"},
		 	 { display: "角色名称", name: "NAME", newline: true, type: "text" ,validate:{required:true}, group: "角色信息",groupicon: groupicon},		
			 { display: "备注", name: "INFO", newline: false, type: "text"  }
			 ]
		 });  
	
	/**角色用户Form*/
	u = $("#RoleUserForm").ligerForm({
		 inputWidth: 150, labelWidth: 80, space: 50,validate:{},
		 fields: [
		 { name: "ID", type: "hidden" },
		 { display: "用户名", name: "SYS_USER_ID",  newline: false,group: "用户角色维护",validate:{required:true},groupicon: groupicon,type: "combobox",
			editor: {							
				valueField: 'ID',
				textField: 'USER_NAME',
				slide: false,
				selectBoxWidth: 290,
				selectBoxHeight: 260,
				hideOnLoseFocus:true,
				hideGridOnLoseFocus:true,
				grid: getGridOptions(true),
				condition: { fields: [{ name: 'USER_NAME', label: '用户名', width: 100, type: 'text' }] }
		 }},
		{ display: "所属角色", name: "SYS_ROLE_ID",  newline: false, type: "combobox",validate:{required:true},
		   options: {							
				valueField: 'SYS_ROLE_ID',
				textField: 'ROLE_NAME',
			    url:'${root!}/sys/role/getRoleCombobox'
			}
		}]
	}); 
	
	//初始化时隐藏
	$("#RoleUserForm").hide();	
		 
	//<!--DataGrid-->
	 g = $("#grid1").ligerGrid({
		columns: [
		  { display: '主键', name: 'ID', align: 'left',hide: 1} ,
		  { display: '用户名', name: 'USER_NAME',width: 150 },
		  { display: '所属角色', name: 'ROLE_NAME',width: 150 },
		  { display: '最后更新人ID', name: 'LAST_UPDATED_BY',width: 150 },
		 /*  { display: '最后更新人', name: 'LAST_UPDATED_USERNAME',width: 150 }, */
		  { display: '最后更新时间', name: 'LAST_UPDATE_DATE', align: 'left'}
		], 		
		url: '${root!}/sys/userRole/getRoleUserJson', 
		pageSize: 20, 
		sortName: 'ruid',
		width: '100%', 
		height: '100%',
		frozen: false,
		checkbox: true,
		rownumbers: true,
		method:"post",
		parms:[{name:"pid",value:'0'}]
		}); 
	
	 $("#findUser").ligerGrid({
			columns: [
		  { display: '主键', name: 'ID', align: 'left',hide: 1} ,
		  { display: '用户名', name: 'USER_NAME',width: 100}		  
		], 		
		url: '${root!}/sys/user/getUserJson', 
		pageSize: 10, 
		checkbox: false,
		rownumbers: true
	}); 
	
	//<!--查询条件-->
	s = $("#search1").ligerForm({
		 inputWidth: 190, labelWidth: 50, space: 50,
			 fields: [
			 { display: "用户名", name: "USERNAME", newline: true, type: "text" , group: "查询条件",groupicon: groupicon},	 
			 { display: "角色名", name: "ROLENAME", newline: false, type: "text"}
			 ]
		 });  
	
	 //用户表格
	 userGrid = $("#userGrid").ligerGrid({
		 	title:"用户列表     "+"<font style='font-weight:normal'><input class='l-text' id='username' ></input><input type='button' class='l-button' onclick='userSearch()' value='查询'></input></font>",
		 	columns: [
					 { name: 'USERID', hide: 1},
					  { display: '用户名称', name:'USERNAME', align: 'left',width: 200}
			],
			url : '/business/base/shopuser/getUserJson',
			delayLoad:true,
			pageSize : 10,
			width : 300,
			height : 280, 
			rownumbers : true,
			checkbox : true 
		});
	 //店铺表格
	 roleGrid = $("#roleGrid").ligerGrid({
		 	title:"角色列表      "+"<font style='font-weight:normal'><input class='l-text' id='rolename' ></input><input type='button' class='l-button' onclick='roleSearch()' value='查询'></input></font>",
		 	columns: [
					  { name: 'ROLEID', hide: 1} ,
					  { display: '店铺名称', name: 'ROLENAME', align: 'left',width: 200}
					 
			],
			url: '/admin/role/getRoleJson', 
			delayLoad:true,
			pageSize : 10,
			width : 300,
			height : 280, 
			rownumbers : true,
			checkbox : true
		});
	 //用户列表框
	 userListbox = $("#listbox1").ligerListBox({
	     isShowCheckBox: true,
	     isMultiSelect: true,
	     height: 140,
	     width:186
	 });
	 //店铺列表框
	 roleListbox = $("#listbox2").ligerListBox({
	     isShowCheckBox: true,
	     isMultiSelect: true,
	     height: 140,
	     width:186
	 });
	
});

/**新增角色*/
function f_New()
{
	RoleClear();
	var data = t.getSelected();
	if(data == null)
	{
	 	$.ligerDialog.success('温馨提示：请在根节点下新增。');
	 	return;
	} 	
	if(data['data']['id'] == 0) {//角色保存
		var filtercontainer = $("#RoleForm").width(530).height(200).hide();
		$.ligerDialog.open({
			width: 560, height: 250,target: filtercontainer, isResize: true, top: 50,title:'新增角色',
			buttons: [
			   { text: '确定', onclick: function (item, dialog) { if(f_RoleSave()) dialog.hide(); } },
			   { text: '取消', onclick: function (item, dialog) { RoleClear();dialog.hide(); } }
			 ]
		});	
	}else{
		$.ligerDialog.success('温馨提示：不能新增下级角色了。');
	}
}

/** 角色保存*/
function f_RoleSave(){
	var success = false;
	var data = f.getData();
	var jsonStr = [];
	jsonStr.push("ID"+ ":" + "'" + stripscript(data['ID'])+ "'");
	if (f.valid()) {
		do_ajaxSubmit2('','RoleForm','${root!}/sys/role/save',jsonStr);
		f_Reload();
		RoleClear();
		success = true;
	}else {
		f.showInvalid();
	}
return success;	
}

/**
 * 创 建 人 ： LiHongYuan
 * 日   期 ： 2013-12-11 上午9:42:52
 * 描   述 ： 角色保存后清空
 *
 */
function RoleClear()
{	
	var initData = {"ROLEID":"","ROLENAME":"","REMARK":""};
	f.setData(initData);
}

/**
* 创 建 人 ： LiHongYuan
* 日   期 ： 2013-12-11 上午9:42:52
* 描   述 ： 角色修改
*
*/
function f_Modify()
{
	var data = t.getSelected();
	if(data == null){
	 	$.ligerDialog.success('温馨提示：请选择要修改的角色。');
	 	return;
	} 
	
	if(data['data']['parentid'] == 0) {
		var filtercontainer = $("#RoleForm").width(530).height(200).hide();
		//var selected = t.getSelected();
		//设置要修改的内容
		f.setData({ ROLEID:data['data']['id'],
					ROLENAME:data['data']['text'],
					AUTHCROLE:data['data']['remark']
		});
		$.ligerDialog.open({
			width: 560, height: 250,target: filtercontainer, isResize: true, top: 50,title:'修改角色',
			buttons: [
			   { text: '确定', onclick: function (item, dialog) { if(f_RoleSave()) dialog.hide(); } },
			   { text: '取消', onclick: function (item, dialog) { RoleClear(); dialog.hide(); } }
			 ]
		});		
	}else{
		$.ligerDialog.success('温馨提示：没有选择角色。');
	}
}

/**
* 创 建 人 ： LiHongYuan
* 日   期 ： 2013-12-11 上午9:42:52
* 描   述 ： 角色删除
*
*/
function f_Del()
{
	var selected = t.getSelected();
	if(selected == null)
	{
	 	$.ligerDialog.success('温馨提示：请选择要删除的角色。');
	 	return;
	} 	
	var selectid = selected['data']['id'];
	var selecttext = selected['data']['text'];
	if(selected['data']['parentid'] == 0) //角色删除	
	{
		$.ligerDialog.confirm('温馨提示：确认是否删除【'+selecttext+'】？', function (yes)
		{
			if(yes==true){
				do_ajaxSubmit(selectid,'${root!}/admin/role/delete/'+selectid);
				f_Reload();
			};
		});
	}
}



/**角色增加所属用户*/
function f_AddUser()
{
	/* var selected = t.getSelected();
	if(selected == null)
	{
	 	$.ligerDialog.success('温馨提示：请选择用户所属角色。');
	 	return;
	} 	
	var selectid = selected['data']['id'];	
	if(selectid == 0)
	{
	 	$.ligerDialog.success('温馨提示：请选择用户所属角色。');
	 	return;
	} 	
	//设置模块ID
	u.setData({ ROLE_ID: selectid}); */
	var filtercontainer = $("#RoleUserForm").width(530).height(200).hide();
	$.ligerDialog.open({
		width: 560, height: 250,target: filtercontainer, isResize: true,allowClose:false,top: 50,title:'添加用户角色',
		buttons: [
		   { text: '确定', onclick: function (item, dialog) { if(f_UserSave()) dialog.hide(); } },
		   { text: '取消', onclick: function (item, dialog) { cancel(); dialog.hide();} }
		 ]
	});		
}

/**角色修改所属用户*/
function f_ModifyUser(){
	var rows = g.getSelectedRows();
	if (rows.length<=0) {
		$.ligerDialog.success('温馨提示：请选择要修改的行。');
		return; 
	}else if(rows.length > 1){
		$.ligerDialog.success('温馨提示：只能修改一行。');
		return; 
	}
	var filtercontainer = $("#RoleUserForm").width(530).height(200).hide();
		u.setData(rows[0]);//把选择的行数据放到form
		$.ligerDialog.open({
			width: 560, height: 250,target: filtercontainer, isResize: true, top: 50,title:'修改用户角色',
			buttons: [
			   { text: '确定', onclick: function (item, dialog) { if(f_UserSave()) dialog.hide(); } },
			   { text: '取消', onclick: function (item, dialog) { cancel(); dialog.hide(); } }
			 ]
		});	
}

//清空查询条件
function cancel()
{	
	var initData = {"USERID":""};
	u.setData(initData);
}

/**用户保存*/
function f_UserSave(){
	var success = false;
	var data = u.getData();
	//var jsonStr = [];
	//jsonStr.push("RUID" + ":" + "'" + stripscript(data['RUID']) + "'");
	if (u.valid()) {
		do_ajaxSubmit1('', 'RoleUserForm', '${root!}/sys/userRole/save');
		f_Reload();
		success = true;
	} else {
		u.showInvalid();
	}
	return success;
}

//<!--移除用户-->
function f_DelUser()
{
	var rows = g.getSelectedRows();
	if (rows.length<=0) {
		$.ligerDialog.success('温馨提示：请选择要移除的行。');
		return; 
	}
	for(var i=0;i<rows.length;i++){
		delPage(rows[i]);
		delete rows[i]['ROLE_NAME'];
		delete rows[i]['USER_NAME'];
		delete rows[i]['LAST_UPDATED_BY'];
		delete rows[i]['LAST_UPDATE_DATE'];
	}
	$.ligerDialog.confirm('确认是否删除？', function (yes)
    {
		if(yes==true){
			do_ajaxSubmit(rows,'${root!}/sys/userRole/delete');	
			f_Reload();
		};
    });
}


//查询
function f_Search(){
var filtercontainer = $("#search1").width(530).height(200).hide();
	$.ligerDialog.open({
		width: 560, height: 250,
		target: filtercontainer, isResize: true, top: 50,
		buttons: [
		   { text: '确定', onclick: function (item, dialog) { g.setOptions({newPage:1});loadData();cancelSearch();dialog.hide(); } },
		   { text: '取消', onclick: function (item, dialog) { cancelSearch();dialog.hide();} }
		 ]
	});
}

function loadData(){
	var sdata = s.getData();
	g.set('parms', { where: $.ligerui.toJSON(sdata)});
	g.loadData();
}

//清空查询条件
function cancelSearch()
{	
	var initData = {"USERNAME":"","ROLENAME":""};
	s.setData(initData);
}

//重新加载树
function f_Reload(){
	t.clear();	
	t.loadData(null, '${root!}/sys/role/getRoleTree');
	var initRoleData = {"ID":"","NAME":"","AUTHCROLE":""};
	var initData = {"UR_ID":"","SYS_USER_ID":"","SYS_ROLE_ID":""};
	u.setData(initData);
	f.setData(initRoleData);
}

function getGridOptions(checkbox) {
	var options = {
		columns: [
		  { display: '主键', name: 'ID', align: 'left',hide: 1} ,
		  { display: '用户名', name: 'NAME',width: 100}	  
		], 		
		url: '${root!}/sys/user/getUserJson', 
		pageSize: 10, 
		sortName: 'USERID',
		width: '99%', 
		height: '98%', 
		checkbox: true,
		rownumbers: true,
	};
	return options;
}

//打开店铺用户添加多对多的关系窗口
function f_ImportMore(){
	var filtercontainer = $("#grantDialog").hide();
	$.ligerDialog.open({title:'增加用户角色',target: filtercontainer,isResize: true,allowClose:false,width:700,
		buttons: [
			   { 	text: '关闭', 
			   		onclick: function (item, dialog) { 
			   			userListbox.removeItems(userListbox.data);
			   			roleListbox.removeItems(roleListbox.data);
			   			$("#username").val("");
			   			$("#rolename").val("");
			   			dialog.hide();
			   		}
			   }
			 ],
		}		
	);
};
//移除列表框内所有用户数据
function addUser()
{
    var data = userListbox.data;
    var selecteds = userGrid.getSelectedRows();
    var selectData = new Array();
    for(var i=0;i<selecteds.length;i++){
    	var isHas = false;
    	 /* if(!(data==null||data=='undefined')){
    		for(var j=0;j<data.length;j++){
        		if(data[j].id ==selecteds[i].USERID){
        			isHas = true;
        		}
        	}
    	}  */
    	if(!isHas){  
	    	var selectObj = {};
	    	selectObj.text = selecteds[i].USERNAME;
	    	selectObj.id = selecteds[i].USERID;
	    	selectData[i]=selectObj;
    	}
    	
    }    
    userListbox.addItems(selectData);
   
}
//移除列表框内选择用户数据
function moveUser()
{
    var selecteds = userListbox.getSelectedItems();
    if (!selecteds || !selecteds.length) return;
    userListbox.removeItems(selecteds);
}
//移除列表框内所有用户铺数据
function moveAllUser()
{ 
	userListbox.removeItems(userListbox.data);
}
//添加在表格选择的数据到列表框内
function addRole()
{
    var data = roleListbox.data;
    var selecteds = roleGrid.getSelectedRows();
    var selectData = new Array();
    for(var i=0;i<selecteds.length;i++){
    	var isHas = false;
    	 /* if(!(data==null||data=='undefined')){
    		for(var j=0;j<data.length;j++){
        		if(data[j].id ==selecteds[i].USERID){
        			isHas = true;
        		}
        	}
    	}  */
    	if(!isHas){  
	    	var selectObj = {};
	    	selectObj.text = selecteds[i].ROLENAME;
	    	selectObj.id = selecteds[i].ROLEID;
	    	selectData[i]=selectObj;
    	}
    	
    }    
    roleListbox.addItems(selectData);
   
}
//移除列表框选择的店铺数据
function moveRole()
{
    var selecteds = roleListbox.getSelectedItems();
    if (!selecteds || !selecteds.length) return;
    roleListbox.removeItems(selecteds);
}
//移除列表框内所有店铺数据
function moveAllRole()
{ 
	roleListbox.removeItems(roleListbox.data);
}
//用户查询
function userSearch(){
	userGrid.setOptions({newPage:1});
	userGrid.set('parms', {username : $("#username").val()});
	userGrid.loadData();
}
//店铺查询
function roleSearch(){
	roleGrid.setOptions({newPage:1});
	roleGrid.set('parms', {rolename : $("#rolename").val()});
	roleGrid.loadData();
}
//保存用户与店铺的权限(多对多)
function submitAdd(){
	$.ajax({type: "POST", url: "/admin/roleuser/saveRoleUsers", async:false,data: "user="+liger.toJSON(userListbox.data)+"&role="+liger.toJSON(roleListbox.data),
		success: function(data) {
			$.ligerDialog.warn(data);
		}
	});
}
</script>
<style type="text/css"> 
	body{ padding:0px; margin:0; overflow:hidden;}
	#layout1{  width:100%;margin:0; padding:0;  }  
	.l-page-top{ height:80px; background:#f8f8f8; margin-bottom:3px;}
	.tree{
		width:200px;
		height:600px;
		margin: 0px;
		border: 1px solid #ccc;
		overflow: scroll;}
</style>
</head>
<body>

<div id="layout1">
	<div position="left" title="角色信息">
		<div class="tree">
			<ul id="tree1" style="margin-top:3px;"></ul>
		</div>
	</div>
	<div position="center" title="用户信息">
		<!--工具栏-->
		<div id="toptoolbar" style="padding:3px; overflow:hidden;" ></div>
		<div id="grid1"></div>
	</div>
</div> 
<!--form-->
<form  id="RoleForm"></form>
<form id="RoleUserForm"></form>
<div style="display:none" id="search1"></div>
<!--datagrid-->
<div id="grid1" style="margin: 5px; padding: 0"></div>

<!-- 用户角色增加多对多关系的窗口 -->
<div id="grantDialog" style="display:none;">
	<table style="margin: 0 auto;">
		<tr>
			<td colspan="2"><div id="userGrid"></div></td>
			<td style="width: 30px;">&nbsp;</td>
			<td colspan="2"><div id="roleGrid"></div></td>
		</tr>
		<tr>
			<td colspan="2" align="right">
				<div  class="middle">
		        <input type="button" onclick="addUser()" value="添加" class='l-button'/>
		        <input type="button" onclick="moveUser()" value="移除" class='l-button'/>
		        <input type="button" onclick="moveAllUser()" value="移除所有" class='l-button'/>
		     	</div>
			</td>
			<td>&nbsp;</td>
			<td colspan="2" align="left">
				<div  class="middle">
		        <input type="button" onclick="addRole()" value="添加" class='l-button'/>
		        <input type="button" onclick="moveRole()" value="移除" class='l-button'/>
		        <input type="button" onclick="moveAllRole()" value="移除所有" class='l-button'/>
		     	</div>
			</td>
		</tr>
		<tr>
			<td colspan="2" align="right"><div id="listbox1"></div></td>
			<td>&nbsp;</td>
			<td colspan="2" align="left"><div id="listbox2"></div></td>
		</tr>
		<tr>
			<td colspan="2"></td>
			<td align="center">
				<button class='l-button' onclick="submitAdd()">保存</button>
			</td>
			<td colspan="2"></td>
		</tr>
	</table>
</div>
</body>
</html>
